<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>06_员工列表练习</title>
</head>
<body>
<input type="text" placeholder="请输入员工姓名" id="i1">
<input type="text" placeholder="请输入员工工资" id="i2">
<input type="text" placeholder="请输入员工岗位" id="i3">
<button onclick="addEmp()">添加员工</button>
<table border="1">
    <caption>员工表</caption>
    <tr>
        <td>姓名</td>
        <td>工资</td>
        <td>岗位</td>
    </tr>
</table>

<script>
    let arr = [];
    function addEmp() {
        var i1 = document.getElementById("i1").value;
        var i2 = document.getElementById("i2").value;
        var i3 = document.getElementById("i3").value;

        let tr = document.createElement('tr');
        let td1 = document.createElement('td');
        let td2 = document.createElement('td');
        let td3 = document.createElement('td');

        td1.innerHTML = i1;
        td2.innerHTML = i2;
        td3.innerHTML = i3;

        tr.append(td1, td2, td3);

        let table = document.querySelector('table');

        table.append(tr);

        document.getElementById("i1").value = '';
        document.getElementById("i2").value = '';
        document.getElementById("i3").value = '';

        arr.push({
            name: i1,
            salary: i2,
            post: i3
        })
        console.log(arr);
    }

</script>

</body>
</html>